<template>
	<view class="lawyer-evaluation">
		<common-navbar title="律师评价"></common-navbar>
		<view class="lawyer-info-container">
			<view class="lawyer-photo-wrapper">
				<u-image width="100%" height="100%" border-radius="12"
					src="http://lz-app-1311894087.cos.ap-nanjing.myqcloud.com/images/kur3poZuiDZbUJx1nssKgwqAkdpmTLbwr2OLqorV.png"
					mode="widthFix" />
			</view>
			<view class="lawyer-info-wrapper">
				<view class="lawyer-name">
					廖开喜律师
				</view>
				<view class="consult-type">
					<text class="label">咨询方式：</text>电话咨询
				</view>
				<view class="lawyer-specialty">
					擅长：民事侵权、婚姻家事、知识产权
				</view>
			</view>
		</view>
		<view class="select-solve-status">
			<view class="title">
				您的问题得到解决了吗？
			</view>
			<view class="switch-tabs">
				<view class="tabs-item" :class="{'active':isResolve}" @click="isResolve = true">
					已解决
				</view>
				<view class="tabs-item" :class="{'active':!isResolve}" @click="isResolve = false">
					未解决
				</view>
			</view>
		</view>
		<view class="service-score-container">
			<view class="title">
				服务评价：
			</view>
			<view class="score">
				<u-rate v-model="score" :count="5" gutter="19" size="44" :min-count="1" active-color="#fcd165" />
			</view>
			<view class="label">
				{{rateLabel[score-1]}}
			</view>
		</view>
		<view class="evaluation-bottom-container">
			<view class="title">
				选择标签:
			</view>
			<view class="tag-list">
				<view class="tag-item" v-for="item,index in tagList" :key="index" :class="{'selected':item.is_selected}"
					@click="onTagClick(item)">
					{{item.tag_name}}
				</view>
			</view>
			<view class="evaluation-input">
				<textarea class="input" :placeholder-style="placeholderStyle" v-model="evaluation"
					placeholder="您的评价将是我们进步的动力，成功路上感谢有您。" />
			</view>
			<button class="submit-btn">
				提交评价
			</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				evaluation: '',
				score: 5,
				isResolve: true,
				rateLabel: ['非常差', '较差', '普通', '满意', '非常满意'],
				placeholderStyle: 'fontSize:24rpx;color:#999999;fontFamily:$global-font-family',
				tagList: [{
					tag_name: '专业性强',
					is_selected: true
				}, {
					tag_name: '态度谦和',
					is_selected: true
				}, {
					tag_name: '温柔耐心',
					is_selected: true
				}, {
					tag_name: '效率很高',
					is_selected: true
				}, {
					tag_name: '专业性强',
					is_selected: true
				}, {
					tag_name: '态度谦和',
					is_selected: true
				}, {
					tag_name: '温柔耐心',
					is_selected: true
				}, {
					tag_name: '效率很高',
					is_selected: true
				}]
			}
		},
		methods: {
			onTagClick(tag) {
				this.$set(tag, 'is_selected', !tag.is_selected);
			}
		}
	}
</script>

<style scoped lang="scss">
	@import "./lawyerEvaluation.scss";
</style>
